<script type="text/javascript">
   $(document).ready(function() {
        var sheepItForm = $('#sheepItForm').sheepIt({
            separator: '',
            allowRemoveLast: false,
            allowRemoveCurrent: true,
            allowRemoveAll: false,
            allowAdd: true,
            allowAddN: false,
            maxFormsCount: 10,
            minFormsCount: 0,
            iniFormsCount: 1
        });
        var formKredit = $('#formKredit').sheepIt({
            separator: '',
            allowRemoveLast: false,
            allowRemoveCurrent: true,
            allowRemoveAll: false,
            allowAdd: true,
            allowAddN: false,
            maxFormsCount: 10,
            minFormsCount: 0,
            iniFormsCount: 1
        });
    });

    function validate(){
        var isValid = true;
        var isBalance = true;

        // cek validasi tanggal
        var tanggal = $('#element_4_1').val();
        $('#tanggal_error').remove();
        if (tanggal == ''){
            isValid = false;            
            $('#form_tanggal').after('<p id="tanggal_error" class="error">Tanggal transaksi harus diisi</p>');
        }

        // cek validasi keterangan
        var keterangan = $('#keterangan').val();
        $('#keterangan_error').remove();
        if (keterangan == ''){
            isValid = false;
            $('#form_keterangan').after('<p id="keterangan_error" class="error">Keterangan transaksi harus diisi</p>');
        }

        // cek validasi data form debet (pilihan akun dan jumlahnya)
        var total = Number(0);
        $('#rm_debet.delete').each(function(i){
            isValid = true; var isNumber = true;
            var message = '';
            var akun = $('#formDebet_'+i+'_akun_debet').val();
            var nilai_akun = $('#formDebet_'+i+'_jml_debet').val();
			
            if (akun == 0){
                isValid = false;
                message = "Harap pilih salah satu akun !!!";
            }
            if (isNaN(nilai_akun)){
                isValid = false;
                isNumber = false;
                if (message == '')
                    message = "Jumlah harus berisi angka !!!";
                else
                    message += "<br>Jumlah harus berisi angka !!!";
            }

            if (nilai_akun == ''){
                isValid = false;
                isNumber = false;
                if (message == '')
                    message = "Jumlah tidak boleh kosong !!!";
                else
                    message += "<br>Jumlah tidak boleh kosong !!!";
            }

            if (isNumber)
                total += parseInt(nilai_akun);

            $('#total_debet').val(total);
            $('#sheepItForm_template'+i).next('#debet_error'+i).remove();
            if (!isValid)
                $('#sheepItForm_template'+i).after('<p id="debet_error'+i+'"class="error">'+message+'</p>');
        });

        // cek validasi data form kredit (pilihan akun dan jumlahnya)
        var total = Number(0);
        $('#rm_kredit.delete').each(function(i){
            isValid = true; var isNumber = true;
            var message = '';
            var akun = $('#formKredit_'+i+'_akun_kredit').val();
            var nilai_akun = $('#formKredit_'+i+'_jml_kredit').val();

            if (akun == 0){
                isValid = false;
                message = "Harap pilih salah satu akun !!!";
            }
            if (isNaN(nilai_akun)){
                isValid = false;
                isNumber = false;
                if (message == '')
                    message = "Jumlah harus berisi angka !!!";
                else
                    message += "<br>Jumlah harus berisi angka !!!";
            }

            if (nilai_akun == ''){
                isValid = false;
                isNumber = false;
                if (message == '')
                    message = "Jumlah tidak boleh kosong !!!";
                else
                    message += "<br>Jumlah tidak boleh kosong !!!";
            }

            if (isNumber)
                total += parseInt(nilai_akun);

            $('#total_kredit').val(total);
            $('#formKredit_template'+i).next('#kredit_error'+i).remove();
            if (!isValid)
                $('#formKredit_template'+i).after('<p id="kredit_error'+i+'"class="error">'+message+'</p>');
        });

        // cek keseimbangan nilai debet dan kredit
        if ($('#total_debet').val() != $('#total_kredit').val()){
            isValid = false;
            isBalance = false;
        }
        
        if (!isValid){
            $('#form_error').remove();
            $('#form_total_debet').before('<p id="form_error" class="error">Terdapat kesalahan pengisian form</p>');

            $('#balance_error').remove();
            if (!isBalance)
                $('#form_total_debet').before('<p id="balance_error" class="error">Total nilai debet dan kredit tidak sama</p>');
            else{
                if ($('#total_debet').val() == 0)
                    $('#form_total_debet').before('<p id="balance_error" class="error">Total nilai debet dan kredit harus lebih besar dari 0</p>');
            }
            
            return false;
        }else{
			$('#form_error').remove();
			$('#balance_error').remove();
            $('#submitButton').removeAttr("disabled");
            return true;
        }
    }
</script>
<style>
    a {
        cursor:pointer;
    }

    #sheepItForm_controls div, #sheepItForm_controls div input {
        float:left;
        margin-right: 10px;
    }
</style>

<div id="navigation" style="display:none;">
    <ul>
        <li class="selected">
            <a href="#">Transaksi</a>
        </li>
        <li>
            <a href="#">Debit</a>
        </li>
        <li>
            <a href="#">Kredit</a>
        </li>
        <li>
            <a href="#">Balance</a>
        </li>
    </ul>
</div>

<div id="steps">
	
	<?php $form=$this->beginWidget('CActiveForm', array(
	'id'=>'pembayaran-pinjaman-form',
	'enableAjaxValidation'=>false,
	)); 
	?>
    
	<fieldset class="step"  style="width:990px;">
        <legend  style="width:990px;">Transaksi</legend>
        <p>
		<label for="HistoryTabungan_TANGGAL_TRANSAKSI">Tanggal</label>
		<?php //echo $form->dateField($model,'TANGGAL_TRANSAKSI'); 
			$this->widget('zii.widgets.jui.CJuiDatePicker', array(
			 'name'=>"Jurnal[TANGGAL]", // the name of the field
			// 'value'=>$model->created,  // pre-fill the value
			 // additional javascript options for the date picker plugin
			 'options'=>array(
							 'showAnim'=>'fold',
							 'dateFormat'=>'dd-mm-yy',  // optional Date formatting
							 'debug'=>true,
							 'changeYear'=> true,
							 'changeMonth'=>true
						),
			 'htmlOptions'=>array(
			 'style'=>'height:17px;'
			 ),
			 ));
		?>
		<?php echo $form->error($model_jurnal,'TANGGAL'); ?>
	</p>

    <p>
		<?php echo $form->label($model_jurnal,'KETERANGAN'); ?>
		<?php echo $form->textArea($model_jurnal,'KETERANGAN'); ?>
		<?php echo $form->error($model_jurnal,'KETERANGAN'); ?>
	</p>
    </fieldset>
	
    <fieldset class="step" id="debetField"  style="width:990px;">
        <legend  style="width:990px;">Debit</legend>        
        <div id="sheepItForm">
            <p id="sheepItForm_template">
					<label for="#sheepItForm_#index#_akun_debet">Akun</label>
					<?php echo $form->DropDownList($model_jurnal_detail,'ID_AKUN',CHtml::listData(MasterAkun::model()->findAll(),'ID_AKUN','NAMA_AKUN'),array('empty'=>'-- Pilih Salah Satu --','id'=>'#formDebet_#index#_akun_debet','name'=>"ID_AKUN_DEBET[#index#]")); ?>
					<?php echo $form->error($model_jurnal_detail,'ID_AKUN'); ?>
				<!--
				<?php //echo form_dropdown('akun_debet[#index#]', $akun, 0, "id='ID_AKUN_DEBET[#index#]' style='width: 260px;'"); ?>
				-->
			
                <br>
                 
					<label for="#sheepItForm_#index#_jml_debet">Jumlah</label>
					<?php echo $form->textField($model_jurnal_detail,'NILAI',array("style"=>"width: 288px;","size"=>"15","maxlength"=>"10",'id'=>'formDebet_#index#_jml_debet','name'=>"jml_debet[#index#]")); ?>
					<?php echo $form->error($model_jurnal_detail,'NILAI'); ?>
					
					<a id="sheepItForm_remove_current">
                    <img id="rm_debet" class="delete" src="<?php echo Yii::app()->request->baseUrl;?>/images/form/cross.png" width="16" height="16" border="0">
					</a>
			</p>
				<!--
				<input style="width: 250px;" id="jml_debet[#index#]" name="jml_debet[#index#]" type="text" size="15" maxlength="10" value=""/>
                &nbsp;
                -->
				
				

                <!-- No forms template -->
            <p id="sheepItForm_noforms_template">Tidak ada data</p>
            <!-- /No forms template-->

            <!-- Controls -->
            <div id="sheepItForm_controls">
                <p id="sheepItForm_add"><a id="add_debet" href="#">Tambah Pilihan</a></p>
            </div>

        </div>
        <?php //echo form_error('akun_debet[]'); ?>
        <?php //echo form_error('jml_debet[]'); ?>

    </fieldset>
    <fieldset class="step" id="kreditField"  style="width:990px;">
        <legend  style="width:990px;">Kredit</legend>
        <div id="formKredit">
            <p id="formKredit_template">
                <label for="formKredit_#index#_akun_kredit">Akun</label>
				<?php echo $form->DropDownList($model_jurnal_detail,'ID_AKUN',CHtml::listData(MasterAkun::model()->findAll(),'ID_AKUN','NAMA_AKUN'),array('empty'=>'-- Pilih Salah Satu --','name'=>"ID_AKUN_KREDIT[#index#]")); ?>
				<?php echo $form->error($model_jurnal_detail,'ID_AKUN'); ?>

			    <?php // echo form_dropdown('akun_kredit[#index#]', $akun, 0, "id='formKredit_#index#_akun_kredit' style='width: 260px;'"); ?>

                <br><label for="formKredit_#index#_jml_kredit">Jumlah</label>
                <input style="width: 250px;" id="formKredit_#index#_jml_kredit" name="jml_kredit[#index#]" type="text" size="15" maxlength="10" value=""/>
                &nbsp;
                <a id="formKredit_remove_current">
                    <img id="rm_kredit"class="delete" src="<?php echo Yii::app()->request->baseUrl;?>/images/form/cross.png" width="16" height="16" border="0">
                </a>

                <!-- No forms template -->
            <p id="formKredit_noforms_template">Tidak ada data</p>
            <!-- /No forms template-->

            <!-- Controls -->
            <div id="formKredit_controls">
                <p id="formKredit_add"><a href="#">Tambah Pilihan</a></p>
            </div>
        </div>
        <?php //echo form_error('akun_kredit[]'); ?>
        <?php //echo form_error('jml_kredit[]'); ?>
    </fieldset>
    <fieldset class="step" style="width:990px;">
        <legend style="width:990px;">Balance</legend>
        <p class="submit">
            <button name="hitung" onclick="validate()" type="button">Hitung Balance</button>
        </p>
        <?php //echo form_error('total_debet'); ?>
        <p id="form_total_debet">
            <label>Total Debet</label>
            <input id="total_debet" name="total_debet" type="text" value="<?php //echo set_value('total_debet');?>" size="8" readonly />
        </p>
        <p>
            <label>Total Kredit</label>
            <input id="total_kredit" name="total_kredit" type="text" value="<?php //echo set_value('total_kredit');?>" size="8" readonly />
        </p>
        <p class="submit">
            <button id="submitButton" disabled type="submit">Simpan</button>&nbsp;
            <button id="registerButton" type="reset">Reset</button>&nbsp;
            <button id="registerButton" type="button" onclick="window.location.href='<?php //echo site_url("keuangan/transaksi");?>'">Kembali</button>
        </p >
    </fieldset>
    <?php
    //echo form_close();
	$this->endWidget();
    ?>
</div>
